<template>
  <BasicModal v-bind="$attrs" @register="registerModal" destroyOnClose :title="title" :width="896"   >

    <BasicTable @register="registerTable" >
    </BasicTable>
  </BasicModal>
  <!-- 表单区域 -->

</template>

<script lang="ts" setup>
  import {ref, computed, unref, reactive} from 'vue';
  import {BasicModal, useModal, useModalInner} from '/@/components/Modal';
  import {BasicForm, FormSchema, useForm} from '/@/components/Form/index';
  import {defHttp} from "/@/utils/http/axios";

  import { ActionItem, BasicColumn, BasicTable, TableAction } from '/@/components/Table';
  import { useListPage } from '/@/hooks/system/useListPage';
  import {useMessage} from "/@/hooks/web/useMessage";
  import {
    listParentByStudent1,
  } from '../../parent/SsTpaiParent.api';

  const { createMessage, createErrorModal } = useMessage();
  const [registerModal1, {openModal}] = useModal();

  const columns:BasicColumn[] = [
    {
      title: '家长姓名',
      align:"center",
      dataIndex: 'name'
    },
    {
      title: '手机号',
      align:"center",
      dataIndex: 'mobile'
    },
    {
      title: '通话类型',//1-sim卡，2-腾讯视频云 ，3-阿里视频云，4-钉钉，5-VOIP，6-微信,默认1',
      align:"center",
      dataIndex: 'numberTypes',
      customRender:({ value, record })=>{
        let str = value;
        let arr = [];
        if(str) {
          arr = str.split(",");
          console.log(arr[0]);
          console.log(arr[1]);
        }
        let re = "";
        for(let i in arr){
          if(arr[i]==1){
            re = re+"sim卡"+",";
          }
          if(arr[i]==2){
            re = re+"腾讯视频云"+",";
          }
          if(arr[i]==3){
            re = re+"阿里视频云"+",";
          }
          if(arr[i]==4){
            re = re+"钉钉"+",";
          }
          if(arr[i]==5){
            re = re+"VOIP"+",";
          }
          if(arr[i]==6){
            re = re+"微信";
          }
        }
        return re;
      },
    },];

  // 列表页面公共参数、方法
  const { tableContext } = useListPage({
    designScope: 'basic-table-demo-ajax',
    tableProps: {
      title: '',
      api: listParentByStudent,
      columns: columns,
      useSearchForm:false,
      formConfig: {
        showAdvancedButton:false,
        showResetButton:false,
        showSubmitButton:false,
        fieldMapToNumber: [
        ],
        fieldMapToTime: [
        ],
      },
      showActionColumn:false,
      actionColumn: {
        width: 120,
      },
    },
  });
  //BasicTable绑定注册
  const [registerTable,{getCacheColumns,getTableRef,getDataSource,reload},{ rowSelection, selectedRowKeys }] = tableContext;


  // Emits声明
  const emit = defineEmits(['register','success']);
  const isUpdate = ref(false);
  const view = ref();
  const planModel = reactive({ });
  //表单配置
  const [registerForm, {setProps,resetFields, setFieldsValue, validate,updateSchema,getFieldsValue}] = useForm({
    labelWidth: 160,
    showActionButtonGroup: false,
    baseColProps: {span: 12}
  });
  const studentid = ref();
  //表单赋值
  const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
    console.log(data)
    studentid.value = data.record.studentId;
    setModalProps({confirmLoading: false,showCancelBtn:false,showOkBtn:false});
  });

  //设置标题
  const title = "关联家长";//computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
  const { createConfirm } = useMessage();


  async function listParentByStudent(params){
    console.log(params)
    params.studentId = studentid.value;
    console.log(params)
    return await listParentByStudent1(params);
  }





  /**
   * 详情
   */
  function handleDetail(record: Recordable) {
    openModal(true, {
      record,
      isUpdate: true,
      showFooter: false,
    });
  }


  //表单提交事件
  async function handleSubmit(v) {

    (selectedRowKeys.value = []) && reload();

  }
  function handleSuccess(){
    (selectedRowKeys.value = []) && reload();
  }
</script>

<style lang="less" scoped>
  /** 时间和数字输入框样式 */
  :deep(.ant-input-number){
    width: 100%
  }

  :deep(.ant-calendar-picker){
    width: 100%
  }
</style>
